<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" />
		<meta name="apple-wap-web-app-capable" content="yes">
		<meta name="apple-wap-web-app-status-bar-style" content="black-translucent">
		<meta name="MobileOptimized" content="240"/>
		<title>我的门票</title>
		<link rel="stylesheet" href="$!webPath/css/reset.css" />
		<link rel="stylesheet" href="$!webPath/css/style.css" />
		<script type="text/javascript" src="$!webPath/js/jquery.min.js" ></script>
	</head>
	<body>
		<ul class="options">
		<span class="options_spanL"><li class="options-jifen active">我的门票
		<div></div>
		</li></span>
		<span class="options_spanR"><li class="options-xilie">已失效的门票
		<div></div>
		</li></span>
		</ul>
		<ul class="cards">
			<li>
				#if($!tickets)
				#foreach($obj in $!tickets)
				<div class="content">
					<div class="content-tickets-left"><img width="100%" style="border: none;" src="$!webPath/imgs/dadada.png"/></div>
					<div class="content-tickets-right">
						<div class="content-tickets-right-tickets">$!obj.ticketName</div>
						<div class="content-tickets-right-text">门票金额&nbsp;&nbsp;<span style="color: red;font-size: 16px;">$!obj.price元</span></div>
						<div class="content-tickets-right-text">赛事场地&nbsp;&nbsp;<span style="color: black;">$!obj.activePlace</span></div>
						<div class="content-tickets-right-text">赛事日期&nbsp;&nbsp;<span style="color: black;">$!obj.activeDate</span></div>
					</div>
					#if($!obj.ticketStatus == -1)
					<div class="sanjiao"></div>
					<div class="qingxie">已失效</div>
					#end
				</div>
				#end
				#else
				<p style="margin: auto; font-size: 16px;width: 70%;text-align: center; padding-top: 4rem;">您还没有门票，点击<a href="$!webPath/ticket/list" style="color: #157DF4;text-decoration:underline; ">前往购买</a></p>
				#end
			</li>

			<li style="display: none;">
				#if($!expiredTicket)
				#foreach($obj in $!expiredTicket)
				<div class="content">
					<div class="content-tickets-left"><img width="100%" style="border: none;" src="$!webPath/imgs/dadada.png"/></div>
					<div class="content-tickets-right">
						<div class="content-tickets-right-tickets">$!obj.ticketName</div>
						<div class="content-tickets-right-text">门票金额&nbsp;&nbsp;<span style="color: red;font-size: 16px;">$!obj.price元</span></div>
						<div class="content-tickets-right-text">赛事场地&nbsp;&nbsp;<span style="color: black;">$!obj.activePlace</span></div>
						<div class="content-tickets-right-text">赛事日期&nbsp;&nbsp;<span style="color: black;">$!obj.activeDate</span></div>
					</div>
					<div class="sanjiao"></div>
					<div class="qingxie">已失效</div>
				</div>
				#end
				#else
				<p style="margin: auto; font-size: 16px;width: 70%;text-align: center; padding-top: 4rem;">没有失效门票</p>
				#end
			</li>
		</ul>
		<script type="text/javascript">
			jQuery(".options span").click(function(){
				jQuery(this).find("li").addClass('active').parent().siblings().find("li").removeClass('active');
				jQuery(".cards li").hide().eq(jQuery(this).index()).fadeIn(1000);
			})
		</script>
	</body>
</html>
